<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%
	String path = request.getContextPath();
%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>小当家商城</title>
<link rel="stylesheet" href="../static/mall/css/swiper-bundle.min.css">
<link rel="stylesheet" href="../static/mall/css/iconfont.css">
<link rel="stylesheet" href="../static/mall/css/common.css">
<link rel="stylesheet" href="../static/mall/styles/header.css">
<link rel="stylesheet" href="../static/sweetalert/sweetalert.css" />
</head>
<body>
	<content id="content">
	<nav id="nav">
		<div class="banner_x center">
			<a href="/index" class="logo"><h1>小当家商城</h1></a>
			<div class="fr">
				<div class="search">
					<input class="text" type="text" id="keyword" autocomplete="off">
					<div class="search_hot"></div>
				</div>
				<div class="button iconfont icon-search" onclick="search()"></div>
			</div>
		</div>
	</nav>

	<div class="user">
		<ul class="selector">
			<li><a href="@{/personal}"> 个人中心 </a></li>
			<li><a href="@{/orders}"> 我的订单 </a></li>
			<li><a href="@{/logout}"> 退出登录 </a></li>
		</ul>
		<a href="##" class="username"> ${session.loginUser.nickName} <i
			class="iconfont icon-down"></i>
		</a>
	</div>
	<div id="banner">
		<div class="all-sort-list">
			<c:forEach items="${categories}" var="category">
				<div class="item">
					<h3>
						<span>·</span><a href="##">${category.categoryName}</a>
					</h3>
					<div class="item-list clearfix">
						<div class="subitem">
							<c:forEach items="${category.secondLevelCategoryVOS}"
								var="secondLevelCategory">
								<dl class="fore1">
									<dt>
										<a href="#">${secondLevelCategory.categoryName}</a>
									</dt>
									<dd>
										<c:forEach
											items="${secondLevelCategory.thirdLevelCategoryVOS}"
											var="thirdLevelCategory">
											<em><a href="#"
												href="/xdjmall/search?categoryId='+${thirdLevelCategory.categoryId}">
													${thirdLevelCategory.categoryName} </a></em>
										</c:forEach>
									</dd>
								</dl>
							</c:forEach>
						</div>
					</div>
				</div>
			</c:forEach>
		</div>
		<div class="swiper-container fl">
			<div class="swiper-wrapper">
				<!-- 配置了轮播图则显示后台配置的轮播图 -->
				<c:forEach items="${carousels}" var="carousel">
					<div class="swiper-slide">
						<a href="${carousel.redirectUrl}"> <img
							src="/xdjmall/goods-img/${carousel.carouselUrl}" alt="">
						</a>
					</div>
				</c:forEach>
			</div>
			<div class="swiper-pagination"></div>
			<div class="swiper-button-prev"></div>
			<div class="swiper-button-next"></div>
		</div>
	</div>

	<div id="sub_banner">
		<!-- 已配置热销商品则显示配置内容 -->
		<c:forEach items="${hotGoodses}" var="hotGoodse">
			<div class="hot-image">
				<a href="/xdjmall/goods/detail/${hotGoodse.goodsId}"> <img
					src="${hotGoodse.goodsCoverImg}" alt="${hotGoodse.goodsName}">
				</a>
			</div>
		</c:forEach>
	</div>

	<div id="flash">
		<h2>新品上线</h2>
		<ul>
			<!-- 已配置新品则显示配置内容 -->
			<c:forEach items="${newGoodses}" var="newGoods">
				<li><a href="<%=path%>/goods/detail/${newGoods.goodsId}"> <img
						src="${newGoods.goodsCoverImg}" alt="${newGoods.goodsName}">
						<p class="name">${newGoods.goodsName}</p>
						<p class="discount">${newGoods.goodsIntro}</p>
						<p class="item_price">${newGoods.sellingPrice}</p>
				</a></li>
			</c:forEach>
		</ul>
	</div>

	<div id="recommend">
		<h2>为你推荐</h2>
		<a href="##" class="more">查看更多>></a>
		<ul>
			<!-- 已配置推荐商品则显示配置内容 -->
			<c:forEach items="${recommendGoodses}" var="recommendGoods">
				<li><a href="/goods/detail/${recommendGoods.goodsId}">
						<div class="info discount" text="${recommendGoods.tag}">新品</div> <img
						src="${recommendGoods.goodsCoverImg}"
						th:alt="${recommendGoods.goodsName}">
						<p class="name">${recommendGoods.goodsName}</p>
						<p class="item_price">${recommendGoods.sellingPrice}</p>
						<p class="counter">猜你喜欢</p>
						<div class="comment">
							<p>新蜂精选</p>
							<p>好物也可以不贵</p>
						</div>
				</a></li>
			</c:forEach>
		</ul>
	</div>
	</content>
	<!-- <div th:replace="mall/footer::footer-fragment"></div> -->
	<!-- jQuery -->
	<script src="../static/jquery/jquery.min.js"></script>
	<script src="../static/bootstrap/js/bootstrap.bundle.min.js"></script>
	<script src="../static/mall/js/swiper-bundle.min.js"
		type="text/javascript"></script>
	<script src="../static/sweetalert/sweetalert.min.js"></script>
	<script src="../static/mall/js/index.js" type="text/javascript"></script>
	<script src="../static/mall/js/search.js" type="text/javascript"></script>
</body>
</html>